Vue.component('left-site',{
    data:function(){
        return{

        }
    },
    props:['pagetype'],
    template:
       '<div id="leftSite_css">'+
            '<section class="leftPart">'+
                '<h3>公众号运营</h3>'+
                '<ul>'+
                    '<li><a :class="{\'activeLi\':pagetype==\'gongzhonghaoxinxi\'}">公众号信息</a> </li>'+
                    '<li><a :class="{\'activeLi\':pagetype==\'daicanerweima\'}">带参二维码</a></li>'+
                    '<li><a :class="{\'activeLi\':pagetype==\'gongzhonghaoyunyingshujufenxi\'}">公众号运营数据分析</a></li>'+
                '</ul>'+
            '</section>'+
            '<section class="leftPart">'+
                '<h3>公众号微站设置</h3>'+
                '<ul>'+
                    '<li><a :class="{\'activeLi\':pagetype==\'weizhanjibenxixi\'}">微站基本信息</a> </li>'+
                    '<li><a :class="{\'activeLi\':pagetype==\'fangkeyindaoshouquan\'}">访客引导授权</a></li>'+
                    '<li><a :class="{\'activeLi\':pagetype==\'fangkedingweigongneng\'}">访客定位功能</a></li>'+
                    '<li><a :class="{\'activeLi\':pagetype==\'yingyeshijianshezhi\'}">营业时间设置</a></li>'+
                    '<li><a :class="{\'activeLi\':pagetype==\'cantaima\'}">餐台码</a></li>'+
                    '<li><a :class="{\'activeLi\':pagetype==\'zidingyifenxiang\'}">自定义分享</a></li>'+
                    '<li><a :class="{\'activeLi\':pagetype==\'yumingjifuwuqi\'}">域名及服务器</a></li>'+
                '</ul>'+
            '</section>'+
            '<section class="leftPart">'+
                '<h3>公众号微站运营</h3>'+
                '<ul>'+
                    '<li><a :class="{\'activeLi\':pagetype==\'weizhanshujufenxi\'}">微站数据分析</a> </li>'+
                    '<li><a :class="{\'activeLi\':pagetype==\'fangkeshujufenxi\'}">访客数据分析</a></li>'+
                    '<li><a :class="{\'activeLi\':pagetype==\'weizhanzhucehuiyuan\'}">微站注册会员</a></li>'+
                    '<li><a :class="{\'activeLi\':pagetype==\'yingyeshijianshezhi\'}">营业时间设置</a></li>'+
                    '<li><a :class="{\'activeLi\':pagetype==\'weizhanyouhuiquan\'}">微站优惠券</a></li>'+
                '</ul>'+
            '</section>'+
            '<section class="leftPart">'+
                '<h3>公众号基础功能</h3>'+
                '<ul>'+
                    '<li><a :class="{\'activeLi\':pagetype==\'zidonghuifu\'}">自动回复</a> </li>'+
                    '<li><a :class="{\'activeLi\':pagetype==\'zidingyicaidan\'}">自定义菜单</a></li>'+
                    '<li><a :class="{\'activeLi\':pagetype==\'sucaiguanli\'}">素材管理</a></li>'+
                '</ul>'+
            '</section>'+
           
      '</div>'
    ,
    created: function(){
        const head = document.getElementsByTagName('head')[0];
        const css = document.getElementById('leftSite_css');
        if(!css){
            const style = document.createElement('style');
            let styleStr=
                '.leftPart{'+
                   'margin-bottom:10px;'+
                '}'+
                '.leftPart h3{'+
                    'font-size:14px;'+
                    'color:#333333;'+
                    'font-weight:bold;'+
                    'line-height:34px;'+
                '}'+
                '.leftPart ul li a{'+
                    'display:inline-block;'+
                    'font-size:12px;'+
                    'color:#333333;'+
                    'cursor:pointer;'+
                    'line-height:24px'+
                '}'+
                '.leftPart ul li a:hover{'+
                    'color:#337AB7;'+
                '}'+
                '.activeLi{'+
                '   color:#337AB7!important;'
                
                ;
            style.innerHTML = styleStr;
            style.id = 'leftSite_css'
            head.appendChild(style)
        }
    }
})